<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>选择发送对象</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <link href="${pageContext.request.contextPath}/static/css/common.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/layer/skin/layer.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/bootstrap-3.3.5/css/bootstrap.min.css"
          rel="stylesheet">
          <link href="${pageContext.request.contextPath}/static/plugins/select2-4.0.0/dist/css/select2.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/plugins/font-awesome-4.3.0/css/font-awesome.min.css"
          rel="stylesheet">
          <link rel="stylesheet" href="${pageContext.request.contextPath}/static/plugins/jquery.time/jquery.timepicker.min.css">
    <script src="${pageContext.request.contextPath}/static/js/jquery-1.11.3.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/bootstrap-3.3.5/js/bootstrap.min.js"></script>
    <script src="/static/plugins/bootstrap-3.3.5/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugins/layer/layer.js" type="text/javascript"></script>
	<script src="${pageContext.request.contextPath}/static/plugins/select2-4.0.0/dist/js/select2.min.js"></script>
	<script src="${pageContext.request.contextPath}/static/plugins/My97DatePicker/WdatePicker.js"
        type="text/javascript"></script>
	<script src="${pageContext.request.contextPath}/static/plugins/jquery.time/jquery.timepicker.min.js"
        type="text/javascript"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/static/js/global.js"></script>
	<style type="text/css">
	*,h3{margin:0;padding:0;}
	
	.clearfix{
		overflow:hidden;
	}
	.lt{
		float:left;
	}
	.rt{
		float:right;
	}
	.wraper,.content{
		width:980px;
		margin:0 auto;
		box-size:border-box;
	}
	.header,.index,.object,.all{
		width:980px;
		margin:0 auto;
		border:1px solid #ccc;
		margin-top:20px;
	}
	.header{
		padding:20px;
		font-size:16px;
		color:#333;
		font-weight:600;
	}
	 .btn{
		margin:0 20px;
		background:#fff !important;
		color:#666 !important;
		border:1px solid #ccc;
		width:120px;
	}
	.content{
		position:relative;
	}
	.content .index{
		height:500px;
		line-height:500px;
		text-align:center;
		color:#666;
		font-size:20px;
	}
	.wraper .active{
		color:#fff !important;
		background:#54b1ff !important;
	}
	.all{
		padding-bottom:180px;
	}
	.all_box{
		width:600px;
		margin:0 auto;
		
	}
	.pic_box{
		text-align:center;
		padding-top:90px;
	}
	.txt{
		text-align:center;
		color:#666;
		font-size:20px;
		padding-top:20px;
	}
	.object{
		padding:0 0 0 10px;
		box-size:border-box;
		height:500px;
		overflow-y:scroll;
	}
	.object li{
		color:#333;
		font-size:16px;
	}
	a{
		color:#333;
		display:inline-block;
		width:95%;
		padding:10px 0 ;
		background:url(${pageContext.request.contextPath}/static/images/admin/wallet/arrow1_05.jpg) no-repeat 100% center;
		border-bottom:1px solid #ccc;
		transition:background 0.2s linear;
		-moz-transition: background 0.2s linear;	/* Firefox 4 */
		-webkit-transition: background 0.2s linear;	/* Safari 和 Chrome */
		-o-transition: background 0.2s linear;	/* Opera */
	}
	.object li span{
		display:inline-block;
		width:15px;
		height:15px;
		*+width:16px;
		*+height:16px;
		line-height:14px;
		border:1px solid #ccc;
		border-radius:50%;
		vertical-align: middle;
		margin-right:4px;
		*+position:relative;
		*+top:-8px;
	}
	.bottom{
		width:800px;
		text-align:center;
		margin:20px auto;
	}
	.bottom .btn{
		width:80px;
	}
	.level2,.level3,.level4,.level5{
		margin-left:20px;
		font-size:16px;
	}
	.level5{
		overflow:hidden;
		
	}
	.level5 li div{
		float:left;
		width:80px;
		height:30px;
		line-height:30px;
		text-align:center;
		border:1px solid #ccc;
		border-radius:4px;
		margin:8px 10px;
		cursor:pointer;
	}
	.wraper .act{
		color:red;
		border-color:red;
	}
	/**全部选中时候**/
	.wraper .act1{
		background:#d74040;
		border-color:#d74040;
	}
	/**部分选中时候**/
	.wraper .act2{
		background:#f8a2a2;
		border-color:#f8a2a2;
	}
	input[type=checkbox]{
		 filter:alpha(opacity=0); 
		 opacity: 0;   
		 vertical-align: middle;  
	}
	#btn1,#btn2{
		font-size:16px !important;
	}
	.btn.active, .btn:active {
		background-image: none;
		outline: 0;
		-webkit-box-shadow: inset 0 0 0 rgba(0,0,0,0);
		box-shadow: inset 0 0 0rgba(0,0,0,0);
	}
	.wraper .active {
		background: #54b1ff !important;
		outline: 0 !important;
		border:none !important;
	}
	</style>
<body>
<div class="wraper">
	<div class="header">
		选择发送对象:<input type="button" class="btn" value="选择全部对象" id="btn1"/>
					<input type="button" class="btn" id="btn2" value="选择部分对象"/>
	</div>
	<div class="content">
		<div class="index">
		亲，请先在左上角点选红包发送对象哦~
		</div>
		<div class="all">
			<div class="all_box">
				<div class="pic_box">
					<img alt="" src="${pageContext.request.contextPath}/static/images/admin/wallet/obj_03.jpg" />
				</div>
				
				<div class="txt">
				
				亲，您选择全部对象是层级下所有对象都可以领取您的红包哦~</div>
			</div>
		</div>
		<div class="object">
			<ul class="menu1" id="menu1">
			</ul>
		</div>
		
	</div>
	<div class="bottom"><input type="button" class="btn" value="确定" id="true" onclick="sure()"/></div>
</div>	 
<script type="text/javascript">
var levelNums = 0;
var agentCodes='',communityIds='',buildingIds='',unitIds='',roomIds='';
$(document).ready(
	 function(){
	var rLevel = '${rLevel}';
	var param = '${prm}';
	if(rLevel=='0'){
		levelNums = 5;
		$.post("${pageContext.request.contextPath}/admin/tagent_list.action", {"agtCode": "1001"} ,function (data) {
		    for (var i = 0; i < data.length; i++) {	
		    	$("#menu1").append("<li class='level1' id='agt_"+data[i].agtCode+"'><span onclick='changStat(this)'  id='checkbox1'><input type='checkbox'/></span><a id='" + data[i].agtCode + "' onclick='showT(this)'>" + data[i].agtName + "</a></li>");
		        //$("#agt1").append("<option value='" + data[i].sid + "'>" + data[i].communityName + "</option>");
		    }
		}, "json");

	}else if(rLevel=='1'){
		levelNums = 4;
		$.post("${pageContext.request.contextPath}/admin/tcommunity_list.action", {"agtCode": param},function (data) {
		    for (var i = 0; i < data.length; i++) {	
		    	$("#menu1").append("<li class='level1' id='com_"+data[i].sid+"'><span onclick='changStat(this)'  id='checkbox1'><input type='checkbox'/></span><a id='" + data[i].sid + "' onclick='showT(this)'>" + data[i].communityName + "</a></li>");
		        //$("#agt1").append("<option value='" + data[i].sid + "'>" + data[i].communityName + "</option>");
		    }
		}, "json");
	}else if(rLevel=='2'){
		levelNums = 3;
		$.post("${pageContext.request.contextPath}/admin/cbuilding_list.action", {"communityId": param},function (data) {
		    for (var i = 0; i < data.length; i++) {	
		    	$("#menu1").append("<li class='level1' id='bud_"+data[i].sid+"'><span onclick='changStat(this)'  id='checkbox1'><input type='checkbox'/></span><a id='" + data[i].sid + "' onclick='showT(this)'>" + data[i].cbName + "</a></li>");
		        //$("#agt1").append("<option value='" + data[i].sid + "'>" + data[i].communityName + "</option>");
		    }
		}, "json");
		
	}

});
	
	function setData(result){
		var type = result.id.split('_')[0];
		if(type=='agt'){
			agentCodes = agentCodes+result.id.split('_')[1]+',';
		}else if(type=='com'){
			communityIds = communityIds+result.id.split('_')[1]+',';
		}else if(type=='bud'){
			buildingIds = buildingIds+result.id.split('_')[1]+',';
		}else if(type=='unit'){
			unitIds = unitIds+result.id.split('_')[1]+',';			
		}else if(type=='room'){
			roomIds = roomIds+result.id.split('_')[1]+',';			
		}
	}
	
	function sure(){
		if($("#btn1")[0].className.indexOf("active") >-1){
			parent.isSendAll.value="1";
			parent.sendObject.value="发送全部对象";
		}else if($("#btn2")[0].className.indexOf("active") >-1){
		agentCodes='';
		communityIds='';
		buildingIds='';
		unitIds='';
		roomIds='';
		var result = $('.level1');
		for(var i=0;i<result.length;i++){
			if($(result[i]).find("span")[0].className.indexOf("act1") > -1){
				setData(result[i]);
			}else if($(result[i]).find("span")[0].className.indexOf("act2") > -1){
				var result2 = $(result[i]).find("ul")[0].childNodes;
				for(var j=0;j<result2.length;j++){
					if($(result2[j]).find("span")[0].className.indexOf("act1") > -1){
						setData(result2[j]);
					}else if($(result2[j]).find("span")[0].className.indexOf("act2") > -1){						
					if(levelNums==3){
						var result3 = $(result2[j]).find("li")[0].childNodes;
						for(var k=0;k<result3.length;k++){
							if($(result3[k])[0].className.indexOf("act") > -1){
								setData(result3[k]);
							}					
						}
					}
					else{
						var result3 = $(result2[j]).find("ul")[0].childNodes;
						for(var k=0;k<result3.length;k++){
							if($(result3[k]).find("span")[0].className.indexOf("act1") > -1){
								setData(result3[k]);
							}else if($(result3[k]).find("span")[0].className.indexOf("act2") > -1){
								if(levelNums==4){
								var result4 = $(result3[k]).find('li')[0].childNodes;								
								for(var m=0;m<result4.length;m++){
									if($(result4[m])[0].className.indexOf("act") > -1){
										setData(result4[m]);
									}
								}
								}else{
									var result4 = $(result3[k]).find('ul')[0].childNodes;								
									for(var m=0;m<result4.length;m++){
										if($(result4[m]).find("span")[0].className.indexOf("act1") > -1){
											setData(result4[m]);
										}else if($(result4[m]).find("span")[0].className.indexOf("act2") > -1){
											var result5 = $(result4[m]).find("li")[0].childNodes;
												for(var n=0;n<result5.length;n++){
													if($(result5[n])[0].className.indexOf("act") > -1){
														setData(result5[n]);
													}
												}										
										}
									}								
							    }
							}
						  }
						}
					}
				}
			}
		}
		parent.agentCodes.value = agentCodes;
		parent.communityIds.value = communityIds;
		parent.buildingIds.value = buildingIds;
		parent.unitIds.value = unitIds;
		parent.roomIds.value = roomIds;	
		if(agentCodes==''&&communityIds==''&&buildingIds==''&&unitIds==''&&roomIds==''){
			alert('请选择发送对象');
			return false;
		}
		parent.sendObject.value="发送部分对象";
		}else{
			alert('请选择发送对象');
			return false;
		}
		parent.reValidate('#sendObject');
		parent.layer.closeAll();
		
	}
	
	function getNewClass(parentClass){
		var level = parentClass.substr(-1);
		var newLevel = parseInt(level)+1;
		var newClass = "level"+newLevel;
		return newClass;
	};
	function appendFn(parentId,sid,parentClass,checkStatus){
		var parentType = parentId.split("_")[0];
		var newClass = getNewClass(parentClass);
		var checkClass = '';
		if(checkStatus=='act1'){
			checkStatus = 'act1';
		}
		if(parentType=='agt'){
			$.post("${pageContext.request.contextPath}/admin/tcommunity_list.action", {"agtCode": sid},function (data) {
				$("#"+parentId).append("<ul class='"+newClass+"' id='agtul_"+parentId+"'></ul>");
			    for (var i = 0; i < data.length; i++) {	
			    	$("#agtul_"+parentId).append("<li id='com_"+data[i].sid+"'><span onclick='changStat(this)' class='"+checkStatus+"'><input type='checkbox'/></span><a id='" + data[i].sid + "' onclick='showT(this)'>" + data[i].communityName + "</a></li>");
			    }
			}, "json");
		}else if(parentType=='com'){
			$.post("${pageContext.request.contextPath}/admin/cbuilding_list.action", {"communityId": sid},function (data) {
				$("#"+parentId).append("<ul class='"+newClass+"' id='comul_"+parentId+"'></ul>");
			    for (var i = 0; i < data.length; i++) {	
			    	$("#comul_"+parentId).append("<li id='bud_"+data[i].sid+"'><span onclick='changStat(this)' class='"+checkStatus+"'><input type='checkbox'/></span><a id='" + data[i].sid + "' onclick='showT(this)'>" + data[i].cbName + "</a></li>");
			    }
			}, "json");
		}else if(parentType=='bud'){
			$.post("${pageContext.request.contextPath}/admin/cinstallunit_listUnit.action", {"bsid": sid},function (data) {
			    $("#"+parentId).append("<ul class='"+newClass+"' id='budul_"+parentId+"'></ul>");
				for (var i = 0; i < data.length; i++) {	
			    	$("#budul_"+parentId).append("<li id='unit_"+data[i].SID+"'><span onclick='changStat(this)' class='"+checkStatus+"'><input type='checkbox'/></span><a id='" + data[i].SID + "' onclick='showT(this)'>" + data[i].CBNAME + "</a></li>");
			    }
			}, "json");
		}else if(parentType=='unit'){
				if(checkStatus=='act1'){
				checkStatus = 'act';
		}
			$.post("${pageContext.request.contextPath}/admin/croom_list2.action", {"unitId": sid},function (data) {
			    $("#"+parentId).append("<ul class='level5' id='unitul_"+parentId+"'></ul>");
				$("#unitul_"+parentId).append("<li id='li_"+parentId+"'></li>");
				for (var i = 0; i < data.length; i++) {	
			    	$("#li_"+parentId).append("<div onClick='divClick(this)' class='"+checkStatus+"' id='room_" + data[i].sid + "'>" + data[i].roomNo + "</div>");
			    }
			}, "json");	
		}
		
	}

//选项展开以及展开时候箭头的指向
	function showT(thisbtn){
		var btn=thisbtn;
		var checkStatus = $(btn).parent().find("span")[0].className;
		if($(btn).siblings().length==1){
			var parentClass = $(btn).parent()[0].className;
			if(parentClass!='level1'){				
				parentClass=$(btn).parent().parent()[0].className;
			}
			var parentId = $(btn).parent()[0].getAttribute("id");
			var sid = btn.id;
			appendFn(parentId,sid,parentClass,checkStatus);
		}
		$(btn).next().slideToggle("slow");
		var pic1="url(${pageContext.request.contextPath}/static/images/admin/wallet/arrow1_05.jpg) no-repeat right center";
		var pic2="url(${pageContext.request.contextPath}/static/images/admin/wallet/arrow2_03.jpg) no-repeat right center";
		var style=$(btn).css("backgroundImage");
		if(style.indexOf("arrow1_05.jpg")>-1){
			btn.style.background=pic2
		}else{
			btn.style.background=pic1
		}
	};
	
	
	$(".all").hide();
	$(".level2").hide();
	$(".level3").hide();
	$(".level4").hide();
	$(".level5").hide();
	$(".level6").hide();
	$(".object").hide();
	
	//点击全部对象和部分对象的切换
	$("#btn1").click(function(){
		$(this).addClass("active").siblings().removeClass("active");
		$(".all").show().siblings().hide();
		$("#true").addClass("active");
	})
	$("#btn2").click(function(){
		$(this).addClass("active").siblings().removeClass("active");
		$(".object").show().siblings().hide();
		$("#true").addClass("active");
	});
	//全部房间的全选功能
	function divClick(thisbtn){
		var btn=thisbtn;
		var num=0,len;
		var $li=$(btn).siblings();
			len=$li.length;
		for(var i=0;i<len;i++){
			if($li[i].className.indexOf("act") > -1){
				num+=1;
			}
		}//num为兄弟级选中的个数
		if($(btn).hasClass("act")){
			var par=$(btn).parent().parent().parent().find("span")[0];
			$(btn).removeClass("act");
			$(btn).parent().parent().parent().find("span").removeClass("act1");
			if(num!=0){
				$(btn).parent().parent().parent().find("span").addClass("act2");
				 parent1(par);
			}else{
				$(btn).parent().parent().parent().find("span").removeClass("act2");
				 parent1(par);
			}
		}else{
			var par=$(btn).parent().parent().parent().find("span")[0];
			$(btn).addClass("act");
			$(btn).parent().parent().parent().find("input[type=checkbox]")[0].checked=true;
			
			
			//部分选中
			if(num==len){
				$(btn).parent().parent().parent().find("span").addClass("act1");
				$(btn).parent().parent().parent().find("span").removeClass("act2");
				 parent2(par);
			}else{
				$(btn).parent().parent().find("span").removeClass("act1");
				$(btn).parent().parent().parent().find("span").addClass("act2");
				 parent2(par);
			}
			
		};
				
	};
	function parent1(sth){
		var b=sth;
		var flag=true;
		var level = parseInt($(b).parent().parent()[0].className.substr(-1));
		var $bro=$(b).parent().siblings().find("span");//兄弟集
		var farther=$(b).parent().parent().parent().find("span")[0];
		for(var j=farther;level>1;level--){
			if(b.className.indexOf("act2") > -1){
				flag=false;
			}else{
			for(var i=0;i<$bro.length;i++){
				if($bro[i].className.indexOf("act") > -1){
					flag=false;//当任何一个兄弟集被选中时 flag=false；
					break;
				}
		    } 
		}
			if(flag){
				$(j).removeClass("act2");
			}else{
				$(j).removeClass("act1");
				$(j).addClass("act2");
			}
			$bro=$(j).parent().siblings().find("span");//兄弟集
			j=$(j).parent().parent().parent().find("span")[0];
			
		}
	
		
	}
	function parent2(sth){
		var b=sth;
		var level = parseInt($(b).parent().parent()[0].className.substr(-1));
		var flag=true;
		var $bro=$(b).parent().siblings().find("span");//兄弟集
		var farther=$(b).parent().parent().parent().find("span")[0];
		for(var j=farther;level>1;level--){
		if(b.className.indexOf("act2") >-1){
			flag=false;
		}else{
			for(var i=0;i<$bro.length;i++){
				if($bro[i].className.indexOf("act1") == -1){
					flag=false;//自己全部选中了，兄弟集存在没被全部选中的
					break;
				}
		    }
		}
			if(flag){
				$(j).addClass("act1");
				$(j).removeClass("act2");
			}else{
				$(j).addClass("act2");
			}
			
			$bro=$(j).parent().siblings().find("span");//兄弟集
			j=$(j).parent().parent().parent().find("span")[0];
		}

	}
	//console.log($("#checkbox1").parent().parent().parent().find("span")[0]);
	function changStat(args){
		if(args==null){
			return;
		}
		var element=args;
		
		var level = parseInt($(element).parent().parent()[0].className.substr(-1));
		var $bro=$(element).parent().siblings().find("span");//兄弟集
		var farther=$($(element).parent().parent().parent().find("span"))[0];//父级
		var flag=true;
		//点击时查看子集是否是选中状态，如子集是全部选中状态则把子集变成未选中状态，自己也变成未选中状态，
		//如子集是部分选中则把子集变成全部选中自己也是全部选中，如子集是未被选中状态则把子集变成全选状态，自己也是全选状态
		
		if(element.className.indexOf("act1") >-1){
			//点击时自己是全选状态时去掉自己的全选状态，去掉父级的全选状态，然后判断兄弟级的状态
			$(element).removeClass("act1");
			$(element).removeClass("act2");
			if(level!=1){
			$(farther).removeClass("act1");
			}
			var tim=$(element).parent().find("ul li span");//子集
			var lens=tim.length;
			var span=$(".level4 span");
			for(var i=0;i<lens;i++){
				$(tim[i]).removeClass("act1");
				$(tim[i]).removeClass("act2");
				
			}
			
			if(element==$("#checkbox1")[0]){
				return;
			}
			if($(element).parent()[0].getAttribute("id").split('_')[0]=='unit'){
				$(element).siblings().find("li div").removeClass("act");
			}
			for(var j=farther;level>1;level--){
				
				for(var i=0;i<$bro.length;i++){
					if($bro[i].className.indexOf("act") > -1){
						flag=false;//当任何一个兄弟集被选中时 flag=false；
						break;
					}
			    } 
				if(flag){
					$(j).removeClass("act2");
				}else{
					$(j).removeClass("act1");
					$(j).addClass("act2");
				}
				$bro=$(j).parent().siblings().find("span");//兄弟集
				j=$(j).parent().parent().parent().find("span")[0];
			}
			
			
			
		}else{//点击时是不选中状态，点击后为选中状态
			$(element).removeClass("act2");
			$(element).addClass("act1");
			
			var tim=$(element).parent().find("ul li span");//子集
			for(var i=0;i<tim.length;i++){
				$(tim[i]).addClass("act1");
				$(tim[i]).removeClass("act2");
			};
			
			if(element==$("#checkbox1")[0]){
				return;
			}
			if($(element).parent()[0].getAttribute("id").split('_')[0]=='unit'){
				$(element).siblings().find("li div").addClass("act");
			}
			//修改父级状态
			for(var j=farther;level>1;level--){
				for(var i=0;i<$bro.length;i++){
					if($bro[i].className.indexOf("act1") == -1){
						flag=false;//自己全部选中了，兄弟集存在没被全部选中的
						break;
					}
			    }
				if(flag){
					$(j).addClass("act1");
					$(j).removeClass("act2");
				}else{
					$(j).addClass("act2");
				}
				
				$bro=$(j).parent().siblings().find("span");//兄弟集
				j=$(j).parent().parent().parent().find("span")[0];
			}
			
			
		}
	}
</script>
</body>
</html>
